<template>
  <div>
    <Navbar>
      <div slot="left" @click="goback">
        <img src="../../../assets/img/common/back.svg" alt="">
      </div>
    <div slot="center" class="center">
      <div v-for="(i,index) in item" :key="i" :class="{active:index===currentindex}"
      @click="getcurrentindex(index)" class="itemcenter">{{i}}</div>
    </div>
    </Navbar>
  </div>
</template>

<script>
import Navbar from '../../../components/common/navbar/navbar.vue'
export default {
  name:"Detailnavbar",
  methods:{
    getcurrentindex(index){
      this.currentindex = index
    },
    goback(){
      this.$router.back()
    }

  },
  data(){
    return{
      item:['商品','参数','评价','推荐'],
      currentindex:0
    }
  },
components:{
  Navbar
}
}
</script>

<style>
.active{
  color:pink;
}
.center{
  display: flex;
  font-size: 13px;
}
.itemcenter{
  flex: 1;
}
</style>